<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">

		<link rel="stylesheet" href="css/mui.min.css">
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<link rel="stylesheet" href="css/cropper.css" />
		<link rel="stylesheet" type="text/css" href="css/mui.picker.min.css" />
		<link rel="stylesheet" type="text/css" href="css/setting.css" />
		<style type="text/css">
			.label {
				cursor: pointer;
			}
			
			.progress {
				display: none;
				margin-bottom: 1rem;
			}
			
			.alert {
				display: none;
			}
			
			.img-container img {
				max-width: 100%;
			}
		</style>
	</head>
	<!--onresize="document.activeElement.scrollIntoView(true);" 所有的被按到的地方因为焦点激活，自动滚动到视野里面
	<body onresize="document.activeElement.scrollIntoView(true);">-->

	<body>
		<div class="mui-page">
			<div class="mui-navbar-inner mui-bar mui-bar-nav">
				<a class="mui-left mui-action-back mui-btn-nav">
					<span class="mui-icon mui-icon-left-nav"></span>
				</a>
				<h1 class="mui-center mui-title">资料修改</h1>
				<a href="javascrip:;" id="btnModify" class="mui-icon mui-pull-right" style="font-size: 14px; color: #000; line-height: 28px; padding-right: 15px;">完成</a>
			</div>
			<div class="mui-page-content" style="margin-top: 55px;" id="userInfo">
				<div class="mui-content-padded">
					<p style="color:#f00">*若成功更换头像需点击完成*</p>
				</div>
				<form id='login-form' class="mui-input-group">
					<input type="file" id="headinput" name="image" accept="image/*" style="display:none">
					<div class="mui-table-view-cell">
						<a id="head" class="mui-navigate-right">头像
							<span class="mui-pull-right head">
      							<img v-if="userinfo.avatarUrl != null" class="head-img mui-action-preview" id="head-img1" v-bind:src="userinfo.avatarUrl"/>
								<img v-else class="head-img mui-action-preview" id="head-img1" src="images/default.png"/>
							</span>
						</a>
					</div>
					<div class="mui-input-row">
						<label>岗位</label>
						<input id='post' type="text" class=" mui-input mui-input-clear" maxlength="10" v-model="userinfo.post=='null'?'':userinfo.post" placeholder="请输入岗位(不超过10个字)">
					</div>
					<div class="mui-input-row">
						<label>单位</label>
						<input id='company' type="text" class="mui-input mui-input-clear mui-pull-right" maxlength="20" v-model="userinfo.company=='null'?'':userinfo.company" placeholder="请输入单位(不超过20个字)">
					</div>
					<div class="mui-input-row">
						<label>所在部门</label>
						<input id='dept' type="text" data-options='{}' readonly class="mui-input-clear mui-input" value="" placeholder="请选择所在部门">
						<!--<input id='dept' type="text" class="mui-input mui-input-clear mui-pull-right" v-model="userinfo.deptName=='null'?'':userinfo.deptName" placeholder="请输入所在部门">-->
					</div>
					<div class="mui-input-row" style="background: #fff;">
						<label>所在支部</label>
						<input id='partyDept' type="text" data-options='{}' readonly class="mui-input-clear mui-input" placeholder="请选择所在支部">
						<!--<input id='partyDept' type="text" class="mui-input mui-input-clear" v-model="userinfo.partyDeptName=='null'?'':userinfo.partyDeptName" placeholder="请输入所在支部">-->
					</div>
					<div class="mui-content-padded">
						<p>姓名、手机号、政治面貌不可设置</p>
					</div>
					<div class="mui-input-row">
						<label>姓名</label>
						<input id='name' type="text" class="mui-input mui-input-clear" v-model="userinfo.name" disabled>
					</div>
					<div class="mui-input-row">
						<label>手机</label>
						<input id='zjno' type="text" class="mui-input mui-input-clear mui-pull-right" v-model="userinfo.mobile" disabled>
					</div>
					<div class="mui-input-row" style="background: #fff;">
						<label>政治面貌</label>
						<input id='politicsStatus' type="text" class="mui-input mui-input-clear" v-model="userinfo.politicsStatus" disabled>
					</div>
				</form>
				<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true">
					<div class="modal-dialog" role="document">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
								<button type="button" class="btn btn-primary" id="crop">确认</button>
							</div>
							<div class="modal-body">
								<div class="img-container" style="height:65%">
									<img id="image" src="">
								</div>
							</div>
							<!--<div class="modal-footer">
								<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
								<button type="button" class="btn btn-primary" id="crop">确认</button>
							</div>-->
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>

</html>
<script type="text/javascript" src="js/mui.min.js "></script>
<script type="text/javascript" src="js/mui.picker.min.js"></script>
<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript" src="js/vue.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/cropper.js"></script>
<script type="text/javascript" src="js/bootstrap.bundle.min.js"></script>
<script type="text/javascript" src="js/config.js"></script>
<script type="text/javascript" src="js/server.js"></script>
<script type="text/javascript" src="js/setting.js"></script>